跳到主要内容

Fill and Stroke


填充与描边(Fill and Stroke)

检查器中的"填充与描边"部分允许您添加和修改当前选定对象的填充和描边属性。您可以根据需要创建任意数量的填充或描边。

填充(Fill)

创建新填充

要创建填充,请选择一个形状,然后使用检查器"填充与描边"部分中的加号按钮。请确保从新菜单中选择"填充"。您可以通过左侧的颜色框来区分图层是否为填充。

新填充

更改填充颜色

要更改填充的颜色,请选择填充图层左侧的颜色框。这将打开颜色选择器。然后,您可以使用各种滑块来选择想要的填充颜色。

更改颜色

更改填充类型

创建新形状时,默认情况下形状将具有实心填充。添加新填充时,默认填充类型设置为线性。我们经常需要在不同类型之间更改填充类型。可以通过选择颜色框来完成此操作。

更改填充类型

打开填充后,您会在选项框的顶部找到填充选择器下拉菜单。

可以选择的填充类型有:

  • 实心(Solid)
  • 线性渐变(Linear Gradient)
  • 径向渐变(Radial Gradient)

更改填充颜色(渐变)

要更改填充的颜色,请选择填充图层左侧的颜色框。这将打开颜色选择器。

更改色标

选择渐变时,您会注意到颜色选择器上方出现一个新条。这表示渐变在不同点的颜色。默认情况下,渐变有两个点。

更改色标的颜色

要更改特定色标的颜色,首先选择要更改的色标。接下来,使用各种滑块来选择该色标应有的颜色。

添加和删除色标

要添加新色标,请单击条上未被其他色标占据的任何位置。这将生成一个额外的色标。

添加删除

要删除色标,请选择要删除的色标,然后按 Delete 或 Backspace 键。

更改填充顺序

填充的顺序决定了它们的渲染顺序,顶部填充渲染在前,底部填充渲染在后。

填充顺序

此顺序可以随时通过单击并拖动图层内的空白区域来更改。

填充属性

每个填充都有其自己的属性,可以在时间线上编辑和设置关键帧。其中一些属性可以通过使用填充选项按钮找到。

填充属性

填充名称 - 您可以使用此属性编辑填充的名称。

混合 - 此选项可用于更改单个填充的混合模式。默认情况下,此模式设置为继承,即继承自形状图层的混合模式。

填充规则 - 此选项可用于更改填充的填充规则。如果希望填充羽化,则必须将其设置为顺时针。

羽化 - 此选项可以切换为羽化所选填充。有关羽化的更多信息,请参阅下文。

删除和隐藏填充

我们经常需要删除或隐藏特定填充。可以通过选择形状,然后使用眼睛图标隐藏填充,或使用减号图标删除填充来完成此操作。

删除

填充规则(Fill Rule)

填充规则决定了形状中重叠路径的填充方式:

  • 非零(Non-Zero) 为顺时针路径分配 +1 值,为逆时针路径分配 -1 值。值为非零的区域将被填充。
  • 奇偶(Even-Odd) 为顺时针路径分配 +1 值,为逆时针路径分配 -1 值。值为偶数的区域将被填充,奇数值则不会。
  • 顺时针(Clockwise) 是 Rive 独有的填充规则。此填充规则允许手动减去路径,可在编辑顶点模式中找到。此填充规则也是启用矢量羽化的形状所必需的。

描边(Stroke)

创建新描边

要创建描边,请选择一个形状,然后使用检查器"填充与描边"部分中的加号按钮。请确保从新菜单中选择"描边"。您可以通过左侧的颜色框来区分图层是否为描边。描边由轮廓框表示。

新描边

更改描边颜色(实心)

要更改描边的颜色,请选择描边图层左侧的颜色框。这将打开颜色选择器。然后,您可以使用各种滑块来选择想要的描边颜色。

描边颜色

更改描边类型

默认情况下,描边设置为实心颜色,但颜色选择器菜单中有多种描边类型可用。

更改描边类型

可以选择的描边类型有:

  • 实心(Solid)
  • 线性渐变(Linear Gradient)
  • 径向渐变(Radial Gradient)

更改描边颜色(渐变)

要更改描边的颜色,请选择描边图层左侧的颜色框。这将打开颜色选择器。选择渐变时,您会注意到颜色选择器上方出现一个新条。这表示渐变在不同点的颜色。默认情况下,渐变有两个点。

更改色标的颜色

要更改特定色标的颜色,首先选择要更改的色标。

更改渐变颜色

接下来,使用各种滑块来选择该色标应有的颜色。

添加和删除色标

要添加新色标,请单击条上未被其他色标占据的任何位置。这将生成一个额外的色标。

添加删除描边色标

要删除色标,请选择要删除的色标,然后按 Delete 或 Backspace 键。

删除和隐藏描边

我们经常需要删除或隐藏特定描边。可以通过选择形状,然后使用眼睛图标隐藏描边,或使用减号图标删除描边来完成此操作。

描边属性(Stroke Properties)

每个描边都有其自己的属性,可以在时间线上编辑和设置关键帧。其中一些属性可以通过使用描边选项按钮找到。

描边名称 - 您可以使用此属性编辑描边的名称。

混合 - 此选项可用于更改单个描边的混合模式。默认情况下,此模式设置为继承,即继承自形状图层的混合模式。

端点(Cap) - 此选项更改描边的端点样式。有关不同端点的详细信息,请参阅下文。

  • 平头(Butt) 描边的末端是一条直线,不延伸超过端点。在零长度路径上,描边将完全不渲染。
  • 圆头(Round) 描边的末端是圆形的。在零长度路径上,描边是一个完整的圆。
  • 方头(Square) 描边的末端是方形,并延伸超过端点。在零长度路径上,描边是一个正方形。

连接(Join) - 此选项更改描边拐角的渲染方式。

  • 圆角(Round) 创建圆角。
  • 斜角(Bevel) 创建斜角。
  • 尖角(Miter) 创建尖角。

应用变换 - "应用变换"切换开关决定形状图层的缩放是否会影响描边的粗细。关闭此开关时,无论缩放如何,描边的粗细都将保持不变。

羽化 - 此选项可以切换为羽化所选描边。有关羽化的更多信息,请参阅下文。

描边类型 - 在描边选项面板底部,您可以找到将描边更改为实心、修剪、虚线描边的选项。

  • 实心 - 将描边渲染为实心描边。这是每个新创建描边的默认描边类型。
  • 修剪(Trim) - 允许您对线段的起点、终点和偏移进行动画处理。了解更多
  • 虚线(Dashed) - 允许您创建具有可动画属性的虚线描边,例如虚线段的长度和偏移。了解更多

矢量羽化(Vector Feathering)

矢量羽化是一种对填充和描边进行羽化的新方法。矢量羽化是 Rive 独创的一种技术,可以柔化矢量路径的边缘,而不会像传统模糊效果那样影响性能。

启用矢量羽化

有两种主要方法可以在任何描边或填充上启用矢量羽化。

启用羽化

  • 羽化图标 - 羽化图标可用于任何填充或描边图层,以启用矢量羽化。
  • 羽化开关 - 羽化开关可在填充/描边选项面板中找到。

羽化选项

羽化可以通过多种方式进行自定义。在填充或描边启用羽化后,羽化选项可在选项面板中找到。

方向(Direction) - 此选项允许您选择随着羽化量增加,路径的羽化方向。

方向

  • 向外(Outer) - 创建从路径向外羽化的效果。
  • 向内(Inner) - 创建从路径向内羽化的效果。

数量(Amount) - 此选项允许您增加或减少应用的羽化量。

数量

空间(Space) - 确定如果羽化存在任何偏移,羽化的填充或描边将如何应用来自父级的变换。

空间

  • 世界(World) - 变换将应用世界变换。羽化将表现为投影。
  • 局部(Local) - 变换将应用局部变换。此模式将使羽化按预期与变换一起工作。

偏移(Offset) - 偏移属性允许您通过增加或减少 X 和 Y 数值来将羽化移离路径。

效果组(Effect Groups)

效果组允许您一次对多个描边和填充应用单个路径效果或效果堆栈,而无需单独配置每个效果。当您有多个形状需要共享相同的修剪、虚线或脚本化效果行为,并且希望从一个位置控制它们时,此功能非常有用。